@lightningjs/blits 1.24.0 → 1.25.1

package/.github/workflows/run-blits-tests.yml

@@ -4,6 +4,7 @@ on:
   pull_request_target:
     branches:
       - dev
+      - master
 
 jobs:
   run-blits-tests:
@@ -45,7 +46,7 @@ jobs:
         echo "summary=$summary" >> $GITHUB_OUTPUT
 
         # If the number of failed tests is greater than 1, exit with error.
-        if [ "$failed" -gt 1 ]; then
+        if [ "$failed" -gt 0 ]; then
             exit 1
         fi
 

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # Changelog
 
+## v1.25.1
+
+_01 apr 2025_
+
+- Fixed issue with page rendering after being destroyed when data is loaded by an async request
+
+## v1.25.0
+
+_28 mar 2025_
+
+- Fixed issue when same effect type is used in `effects` attribute
+- Added ability to enable / disable announcer via launch setting as well as runtime
+
 ## v1.24.0
 
 _26 mar 2025_

package/docs/plugins/text-to-speech-announcer.md

@@ -46,3 +46,15 @@ Blits.Component('MyComponent', {
   }
 })
 ```
+
+## Enabling / disabling the announcer
+
+By default the announcer is disabled. This mean that whenever you call `this.$announcer.speak()` there will actually not be anything spoken out via the Text To Speech engine.
+
+In order to enable utterances being spoken out, you can set the Blits launch setting `announcer` to `true` in the index.js.
+
+Alternatively the announcer can be enabled or disabled run time by using one of the following methods on the Announcer pluging:
+
+- `this.$announcer.enable()` - activates the announcer
+- `this.$announcer.disable()` - deactivates the announcer
+- `this.$announcer.disable(true/false)` - turns the announcer or on off

package/index.d.ts

@@ -929,7 +929,22 @@ declare module '@lightningjs/blits' {
      *
      * @important if you dont know what you're doing here, you probably shouldn't be doing it!
      */
-    advanced?: Partial<RendererMainSettings>
+    advanced?: Partial<RendererMainSettings>,
+    /**
+     * Whether or not the announcer should be activated on initialization
+     *
+     * When set to `false` announcements via `this.$annoucer.speak()` will
+     * be ignored. When set to `true` announcement will be spoken out via the
+     * text to speech API
+     *
+     * Announcer can be enabled / disabled run time as well via:
+     * - this.$announcer.enable()
+     * - this.$announcer.disable()
+     * - this.$announcer.toggle(true/false)
+     *
+     * @default false
+     */
+    announcer?: boolean
   }
 
   interface State {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lightningjs/blits",
-  "version": "1.24.0",
+  "version": "1.25.1",
   "description": "Blits: The Lightning 3 App Development Framework",
   "bin": "bin/index.js",
   "exports": {

package/src/announcer/announcer.js

@@ -19,7 +19,22 @@ import speechSynthesis from './speechSynthesis.js'
 
 let debounce
 
+let active = false
+
+const enable = () => {
+  active = true
+}
+
+const disable = () => {
+  active = false
+}
+
+const toggle = (v) => {
+  active = v ? true : false
+}
+
 const speak = (message, politeness = 'off') => {
+  if (active === false) return
   clearTimeout(debounce)
   speechSynthesis.cancel()
   // assertive messages get spoken immediately
@@ -45,4 +60,7 @@ export default {
   polite,
   assertive,
   stop,
+  enable,
+  disable,
+  toggle,
 }

package/src/application.js

@@ -54,6 +54,8 @@ const Application = (config) => {
   }
 
   config.hooks[symbols.init] = function () {
+    // set the initial activation state of the announcer based on launch setting
+    this.$announcer.toggle(Settings.get('announcer', false))
     const keyMap = { ...defaultKeyMap, ...Settings.get('keymap', {}) }
 
     keyDownHandler = async (e) => {

package/src/component/base/methods.js

@@ -59,6 +59,8 @@ export default {
       deleteChildren(this[symbols.children])
       removeGlobalEffects(this[symbols.effects])
       Log.debug(`Destroyed component ${this.componentId}`)
+      this[symbols.state] = {}
+      this[symbols.props] = {}
     },
     writable: false,
     enumerable: true,

package/src/engines/L3/element.js

@@ -328,24 +328,29 @@ const propsTransformer = {
         v[i].props.color = colors.normalize(v[i].props.color)
       }
     }
-
+    const effectNames = {}
     if (this.element.node === undefined) {
+      this.element.effectNames = []
       this.props['shader'] = renderer.createShader('DynamicShader', {
         effects: v.map((effect) => {
+          let name = effect.type
+          if (effectNames[name] !== undefined) {
+            name += ++effectNames[name]
+          } else {
+            effectNames[name] = 1
+          }
+          name += this.element.counter
+          this.element.effectNames.push(name)
           // temporary add counter to work around shader caching issues
-          return renderer.createEffect(
-            effect.type,
-            effect.props,
-            effect.type + this.element.counter
-          )
+          return renderer.createEffect(effect.type, effect.props, name)
         }),
       })
     } else {
       for (let i = 0; i < v.length; i++) {
+        const name = this.element.effectNames[i]
         // temporary add counter to work around shader caching issues
-        const target = this.element.node.shader.props[v[i].type + this.element.counter]
+        const target = this.element.node.shader.props[name]
         const props = Object.keys(v[i].props)
-
         if (target == undefined) continue
         for (let j = 0; j < props.length; j++) {
           target[props[j]] = v[i].props[props[j]]
@@ -651,6 +656,7 @@ export default (config, component) => {
     scheduledTransitions: {},
     config,
     component,
+    effectNames: [],
     counter: counter++,
   })
 }

package/src/engines/L3/element.test.js

@@ -551,10 +551,6 @@ test('Element - Set `show` property as false', (assert) => {
 
   assert.equal(el.node['alpha'], 0, 'Node alpha parameter should set to 0')
   assert.equal(el.props.props['alpha'], 0, 'Props alpha parameter should set')
-  assert.equal(el.node['width'], 0, 'Node width parameter should set to 0')
-  assert.equal(el.props.props['width'], 0, 'props width parameter should set to 0')
-  assert.equal(el.node['height'], 0, 'Node height parameter should set to 0')
-  assert.equal(el.props.props['height'], 0, 'props height parameter should set to 0')
 
   assert.end()
 })
@@ -567,9 +563,7 @@ test('Element - Set `show` property as false', (assert) => {
   assert.equal(el.node['alpha'], 1, 'Node alpha parameter should be set')
   assert.equal(el.props.props['alpha'], 1, 'Props alpha parameter should be set')
   assert.equal(el.node['width'], 960, 'Node width parameter should be set')
-  assert.equal(el.props.props['width'], 960, 'props width parameter should be set')
   assert.equal(el.node['height'], 540, 'Node height parameter should be set')
-  assert.equal(el.props.props['height'], 540, 'props height parameter should be set')
 
   assert.end()
 })